<template>
  <ul class="contentBox">
    <li class="qiugou">
      <p class="p1">
        <span class="title">
          <van-icon class="icontitle" :name="icongm" />求购石墨烯求购石
        </span>
        <span class="title title2">
          <van-icon class="icontitle" :name="iconwz" />求购石墨烯
        </span>
      </p>
      <p class="p2">
        <span class="p-text">
          数量：
          <span class="p-show">6.0</span>
        </span>
        <span class="p-text">
          时间：
          <span class="p-show">2019-07-24</span>
        </span>

        <span class="p-text">
          产地/厂家：
          <span class="p-show">上海</span>
        </span>
        <span class="p-text">
          材质：
          <span class="p-show">1#b</span>
        </span>

        <span class="p-text">
          产地/厂家：
          <span class="p-show">上海</span>
        </span>
        <span class="p-text">
          规格：
          <span class="p-show">100*200</span>
        </span>
      </p>
    </li>
    <li class="qiugou">
      <p class="p1">
        <span class="title">
          <van-icon class="icontitle" :name="icongm" />求购石墨烯求购石
        </span>
        <span class="title title2">
          <van-icon class="icontitle" :name="iconwz" />求购石墨烯
        </span>
      </p>
      <div class="gongying">
        <div class="gongyingleft"></div>
        <div class="gongyingright">
          <p class="p2">
            <span class="p-text">
              价格：
              <span class="p-show">5200</span>
            </span>
            <span class="p-text">
              时间：
              <span class="p-show">2019-07-24</span>
            </span>

            <span class="p-text">
              数量：
              <span class="p-show">1000吨</span>
            </span>
            <span class="p-text">
              材质：
              <span class="p-show">1#20</span>
            </span>

            <span class="p-text">
              厂家：
              <span class="p-show">上海</span>
            </span>
            <span class="p-text">
              规格：
              <span class="p-show">100*200</span>
            </span>
          </p>
        </div>
      </div>
    </li>
  </ul>
</template>

<script type="text/ecmascript-6">
import icongm from "../../assets/img/replaypart/icongm.png";
import iconwz from "../../assets/img/replaypart/iconwz.png";


export default {
  components: {},
  data() {
    return {
      icongm,
      iconwz,
  
    };
  },
  methods: {}
};
</script>
<style scoped  lang="less">
.qiugou {
  padding: 0.3rem;
  margin-bottom: 0.3rem;
  background: rgba(255, 255, 255, 1);
  box-shadow: 0 3px 8px 0 rgba(0, 10, 0, 0.2);
  .gongying {
    display: flex;
    .gongyingleft {
      width: 1.6rem;
      height: 1.68rem;
      background: red;
      margin-right: 0.3rem;
      border-radius: 0.16rem;
    }
    .gongyingright {
      width: 100%;
      flex: 1;
    }
  }

  .p1 {
    display: flex;
    margin-bottom: 0.3rem;
    &:last-child {
      margin-bottom: 0;
    }
    .title {
      width: 50%;
      overflow: hidden;
      font-size: 0.32rem;
      font-weight: bolder;
      color: rgba(39, 41, 55, 1);
      display: flex;
      align-items: center;
      .icontitle {
        width: 0.4rem;
        height: 0.4rem;
        font-size: 0.4rem;
        margin-right: 0.1rem;
      }
    }
    .title2 {
      .icontitle {
        width: 0.28rem;
        height: 0.28rem;
        font-size: 0.28rem;
      }
      justify-content: flex-end;
      font-size: 0.26rem;
      font-weight: normal;
      color: rgba(228, 152, 41, 1);
    }
  }
  .p2 {
    display: flex;
    flex-wrap: wrap;
  }
  .p-text {
    width: 50%;
    overflow: hidden;
    font-size: 0.26rem;
    margin-bottom: 0.3rem;
    color: rgba(110, 111, 117, 1);
  }
  .p-show {
    color: rgba(39, 41, 55, 1);
  }
}
</style>
